<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="../../css/font-icons.css">
    <link rel="stylesheet" href="../../css/iuapmobile.um.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/iuapmobile.um.listview.css">
    <link rel="stylesheet" href="../../css/w_wyf.css"/>
    <script src="../../js/jquery.min.js"></script>
    <script src="../../js/summer.js"></script>
    <script src="../../js/Frameworks/iuapmobile.frameworks.ui.js"></script>
    <script type="text/javascript" src="../../js/knockout.js"></script>
    <script type="text/javascript" src="../../js/Frameworks/iuapmobile.frameworks.listview.js"></script>
    <script src="js/w_wyf.js"></script>
    <style type="text/css">
        .um-list .um-list-item-inner:after{
            /*background-color: #FFFFFF;*/
        }
        .um-list .um-list-item-left {
            width: 75px;
        }
    </style>
</head>
<body>
<div class="um-page" id="w_wyf">
    <div id="header" class="um-header">
        <a href="#" class="um-back" onclick="summer.closeWin()"> 返回</a>
        <h3>水电气费列表</h3>
        <a class="um-header-right ti-plus f20" href="#wfyDetail"></a>
    </div>
    <div id="main" class="um-content">
        <div class="um-listview-wrap" id="listview">
            <ul class="um-list um-no-active" data-bind="foreach:data">
                <li class="um-listview-row">
                    <a href="#" class="um-list-item um-swipe-action um-no-icon">
                        <div class="um-swipe-btns">
                            <span class="um-swipe-btn um-delete ti-trash"></span>
                        </div>
                        <!--<div class="um-list-item-media">
                            <img alt="" height=74 data-bind="attr:{src: img[0]}">
                        </div>-->
                        <div class="um-list-item-inner">
                            <div class="um-list-item-body" style="padding:0 5px 0 5px;">
                                <!--<div data-bind="text:title" class="fb f16 um-text-overflow"></div>
                                <div>
                                    <span data-bind="text:detail" class="f14 um-gray listview-detail"
                                          style="height:40px;"></span>
                                </div>
                                <div class="f12 tr um-blue">
                                    <span data-bind="text:comments"></span><span class="ml5">跟帖</span>
                                </div>-->
                                <div class="clearfix f16">
                                    <div class="um-xs-6 tl um-text-overflow">
                                        <span class="fb">单号：</span><span class="fb" data-bind="text:title"></span>
                                    </div>
                                    <div class="um-xs-6 tr um-text-overflow um-red">
                                        <span>￥</span>
                                        <span>999</span>
                                    </div>
                                </div>
                                <div class="clearfix mt5 f12">
                                    <div class="um-xs-6 tl um-text-overflow">
                                        <span class="um-gray">缴费月</span>
                                        <span class="um-gray">2017-6至2017-7</span>

                                    </div>
                                    <div class="um-xs-6 tr um-text-overflow">
                                        <span class="um-gray">缴费日期</span>
                                        <span class="um-gray" data-bind="text:time">2015-07-27</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="um-page" id="wfyDetail">
    <div class="um-header">
        <a href="#" class="um-back">返回</a>
        <h3>缴纳费用</h3>
        <a href="#" class="um-header-right ti-save f20">提交</a>
    </div>
    <div class="um-content">
        <ul class="um-list f14" style="margin:10px 0px;padding:0 15px;">
            <li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							业主名称
						</div>
						<div class="um-list-item-right">
							<input type="text" readonly="readonly" class="form-control" value="张三"/>
						</div>
					</div>
				</div>
			</li>
			<!--<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							车位信息
						</div>
						<div class="um-list-item-right">
							<input type="text" readonly="readonly" class="form-control" value="XXX小区3号楼2单元1206"/>
						</div>
					</div>
				</div>
			</li>-->
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							上次缴费月
						</div>
						<div class="um-list-item-right">
							<input type="text" name="date" class="form-control" readonly="readonly" value="2017年4月">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							本次缴费月
						</div>
						<div class="um-list-item-right">
							<input type="date" name="date" class="form-control">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							水费单价
						</div>
						<div class="um-list-item-right">
							<input type="number" value="50" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							用水量
						</div>
						<div class="um-list-item-right">
							<input type="number" value="3" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							水费金额
						</div>
						<div class="um-list-item-right">
							<input type="number" value="150" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							电费单价
						</div>
						<div class="um-list-item-right">
							<input type="number" value="50" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							用电量
						</div>
						<div class="um-list-item-right">
							<input type="number" value="3" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							电费金额
						</div>
						<div class="um-list-item-right">
							<input type="number" value="150" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							气费单价
						</div>
						<div class="um-list-item-right">
							<input type="number" value="50" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							用气量
						</div>
						<div class="um-list-item-right">
							<input type="number" value="3" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							气费金额
						</div>
						<div class="um-list-item-right">
							<input type="number" value="150" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
			<li>
				<div class="um-list-item">
					<div class="um-list-item-inner">
						<div class="um-list-item-left">
							总金额
						</div>
						<div class="um-list-item-right">
							<input type="number" value="450" class="form-control" readonly="readonly">
						</div>
					</div>
				</div>
			</li>
        </ul>

    </div>

</div>
</body>
</html>